<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
	function resCalc() {
		numA = document.getElementById("num_a").value;
		numB = document.getElementById("num_b").value;
		document.getElementById("result").value = Number(numA) + Number(numB);
	}
</script>
</head>
<body>
	<form action="/example/HTML 5/demo_form.asp" method="get">
		Webpage: <input type="url" list="url_list" name="link" />
		<datalist id="url_list">
			<option label="W3School" value="http://www.w3school.com.cn" />
			<option label="Google" value="http://www.google.com" />
			<option label="Microsoft" value="http://www.microsoft.com" />
		</datalist>
		<input type="submit" />
	</form>

	<form action="/example/HTML 5/demo_form.asp" method="get">
		Username: <input type="text" name="usr_name" /> 
		Encryption:
		<keygen name="security" />
		<input type="submit" />
	</form>

	<p>使用 output 元素的简易计算器：</p>
	<form onsubmit="return false">
		<input id="num_a" /> + <input id="num_b" /> =
		<output id="result" onforminput="resCalc()"></output>
	</form>
</body>
</html>